import { Component, OnInit, Output, EventEmitter } from '@angular/core';


@Component({
  selector: 'app-tag',
  templateUrl: './tag.html',
  styleUrls: ['./tag.css']
})
export class TagComponent implements OnInit {

  @Output() public tagList: EventEmitter<any>  = new EventEmitter();

  @Output() public TagsList: EventEmitter<any> = new EventEmitter();

  newTag:  string;
  tags:    any;
  tagsObj: any;

  constructor() {
    this.newTag = '';
    this.tags   = [];
  }

  addTag(event) {
    this.tagsObj = {
      newTag:    this.newTag,
      completed: false
    }

    this.tags.push(this.tagsObj);
    this.TagsList.emit(this.tags);
    console.log('--- befor tags list ---', this.tags);
    this.newTag = '';
    event.preventDefault();
    this.tagList.emit(this.tags[this.newTag]);
    console.log('--- after tags list ---', this.tags);
  }

  deleteTag(index) {
    this.tags.splice(index, 1);
  }

  ngOnInit() {}

}
